<template>
	<view style="width: 100%;">
		<view class="content">
			<u-form :model="form" ref="form" style="margin-top: 24rpx;">
				<u-row gutter="100">
					<u-col span="10">
						<u-form-item :border-bottom="true" label="交班人:" label-width='150rpx' prop="userName">
							<u-input  v-model="form.userName" placeholder="" />
						</u-form-item>
					</u-col>

				</u-row>
			</u-form>

		</view>
		<view class="footer">
			<u-button type="primary" style="padding: 20rpx 100rpx;" @click="submit">确定</u-button>
			<u-button type="primary" :plain="true" style="padding: 20rpx 100rpx;margin-left: 10rpx;"
				@click="cancel">取消</u-button>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import DefectiveProduct from './DefectiveProduct.vue'
	export default {
		components: {
			DefectiveProduct
		},
		props: {

			itemTypeOptions: {
				default: Array
			}
		},
		data() {
			return {
				form: {},
				gznTabs: [],
				gznWrap: [],
				showDefectiveProduct: false,
				productType: "",
				popuptype: 'defectiveProduct',

				// 当前tabs
				currindex: 0,
				formData: [],
				rules: {
					'pack': {
						type: 'string',
						required: true,
						message: '请选择包装',
						trigger: ['blur', 'change']
					},
					'label': {
						type: 'string',

						required: true,
						message: '请选择标签',
						trigger: ['blur', 'change']
					},
					'quantityFeedback': {
						type: 'number',

						required: true,
						message: '请填写报工数量',
						trigger: ['blur', 'change']
					},
				},
				data_index: '',
				// 包装
				showWrap: false,
				// 标签
				showTabs: false
			}
		},
		onReady() {
			//如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
			this.$refs.formData.setRules(this.rules)
		},
		created() {

			this.getReaOrder()
			// 获取字典-标签
			this.$u.api.getDicts('gzn_tabs').then(res => {
				this.gznTabs = res.data;

			})
			// 获取字典-包装
			this.$u.api.getDicts('gzn_wrap').then(res => {
				this.gznWrap = res.data;
			})



		},
		methods: {
			// 包装选择
			wrapConfirm(arr) {

				this.formData[this.currindex].pack = arr[0].value
			},
			// 标签选择
			tabsConfirm(arr) {

				this.formData[this.currindex].label = arr[0].value
			},
			// tabs切换
			tabsClick(item, index) {

				this.data_index = item.worklineName

				this.currindex = index;

				this.$nextTick(() => {
					this.$forceUpdate()
				})

			},
			close() {
				this.showDefectiveProduct = false;
			},
			// 获取每条产线对应的发布工单
			getReaOrder() {
				this.$u.api.getReleaseOrderByWorklineFirst().then(res => {
					this.data_index = res.data[0].worklineName
					this.currindex = 0
					if (res.data.length > 0) {


						let arr = res.data.sort((a, b) => a.worklineId - b.worklineId);
						this.formData = arr.map((item, index) => {

							return {
								worklineId: item.worklineId,
								// batchCode:item.batchCode,
								workorderCode: item.workorderCode,
								workorderId: item.workorderId,
								releaseOrderCode: item.releaseOrderCode,
								releaseOrderId: item.releaseOrderId,
								productName: item.productName,
								packageYield: null,
								worklineName: item.worklineName,
								mixedProductName: "",
								mixedProductId: "",
								pack: "",
								label: "",
								quantityFeedback: 0,
								// defectiveProductQuantity: null,
								defectiveProductRecoverNumber: 0,
								recyclingScrap: 0,
								crushedMaterialQuantity: 0,
								mixedQuantity: 0
							}
						})
					}

				})

			},
			// 确认提交
			submit() {
				// let isOk = this.formData.every(item => {
				// 	return item.quantityFeedback > 0 && item.label != '' && item.pack != ''
				// })
				console.log('11111111111111111111111', this.formData)
				if (true) {
					this.$u.api.executeShiftHandover({
						userName: this.form.userName,
						proFeedbackList: this.formData
					}).then(res => {
						if (res.code == 200) {

							uni.showToast({
								title: '操作成功',
								//将值设置为 success 或者直接不用写icon这个参数
								icon: 'none',
								//显示持续时间为 2秒
								duration: 2000
							})
							setTimeout(() => {
								this.cancel(); // 触发父组件的关闭事件
							}, 500)
						}
					})
				} else {
					uni.showToast({
						title: '请确认每条产线数据是否填写完整 或 去单独报工',
						//将值设置为 success 或者直接不用写icon这个参数
						icon: 'none',
						//显示持续时间为 2秒
						duration: 2000
					})
				}


			},
			// 取消提交	
			cancel() {
				this.formData = [];
				this.$forceUpdate()
				this.$emit("closePopup"); // 触发父组件的关闭事件
			},

			// 选择不良品回调
			handleDefectiveProduct(value) {

				if (this.popuptype == 'defectiveProduct') {
					console.log('选择不良品回调', value)
					this.formData[this.currindex].defectiveProductRecoverProductName = value[0].productName;

					this.formData[this.currindex].defectiveProductRecoverProductId = value[0].productId;
				} else if (this.popuptype == 'recyclingScrap') {
					this.formData[this.currindex].recyclingScrapProductName = value[0].productName;
					this.formData[this.currindex].recyclingScrapProductId = value[0].productId;
					console.log('选择洗机料', value)
				} else if (this.popuptype == 'crushedMaterial') {
					this.formData[this.currindex].crushedMaterialProductName = value[0].productName;
					this.formData[this.currindex].crushedMaterialProductId = value[0].productId;
					console.log('选择待回收料', value)
				} else if (this.popuptype == 'mixedProduct') {
					this.formData[this.currindex].mixedProductName = value[0].productName;
					this.formData[this.currindex].mixedProductId = value[0].productId;
					console.log('选择待混好的料', value)
				}
			},
			// 选择不良品弹框
			defectiveFocus(item, index) {
				this.currindex = index;
				this.popuptype = 'defectiveProduct';
				this.productType = '不良品';
				this.showDefectiveProduct = true;
			},
			// 选择洗机料
			selectRecyclingScrap(item, index) {
				this.currindex = index;
				this.popuptype = 'recyclingScrap';
				this.productType = '报废品';
				this.showDefectiveProduct = true;
			},
			// 选择待回收料
			selectCrushedMaterial(item, index) {
				this.currindex = index;
				this.productType = '回收品';
				this.popuptype = 'crushedMaterial';
				this.showDefectiveProduct = true;
			},
			// 选择混好的料
			selectmixedProduct(item, index) {
				this.currindex = index;
				this.productType = '半成品';
				this.popuptype = 'mixedProduct';
				this.showDefectiveProduct = true;
			},

		}
	}
</script>

<style lang="scss" scoped>
	.content {
		width: 100%;
		// height: 100%;
		// display: flex;
		// flex-direction: column;
		padding: 20rpx;



	}

	.title {
		text-align: center;
		font-size: 50rpx;
		margin: 20rpx 0;
	}

	.tablelist {
		width: 100%;
		height: 100%;
		margin: 20rpx 0;

	}

	.footer {
		width: 100%;
		display: flex;
		margin: 20rpx auto;

	}

	.tab-content {
		width: 100%;
		padding: 10px;
		// position: relative;

		.tabs {
			display: flex;
			flex-wrap: nowrap;
			// position: relative;
			color: rgb(70, 71, 72);
			// border-bottom: 2rpx solid rgb(193, 193, 193);

			.tabs-item {
				margin-right: 20rpx;
				margin-bottom: 20rpx;
				cursor: pointer;
				font-size: 42rpx;
				text-align: center;
				width: 24%;


				&.active {
					color: #2979ff;
					z-index: 9;

					&::after {
						content: "";
						bottom: -4rpx;
						left: 0;
						right: 0;
						height: 4rpx;
						background: #2979ff;
					}
				}
			}
		}

		.tab-list {
			// display: flex;
			// align-items: center;
			width: 100%;
			margin: 20rpx 0;
		}
	}
</style>